<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>信息搜索</title>
    <!-- load css -->
     <link rel="stylesheet" href="../css/layui.css"  media="all">

</head>
<style type="text/css">
    th,td,table{
        text-align: center;
    }
        .layui-table td, .layui-table th{padding: 0px;width: 50px;height: 25px;}
</style>

<body style="width: 560px; height: 220px;padding:20px; margin: 0 auto;">

<!-- 下拉列表 代码-->
<select name="b_class" lay-verify="" style=" height: 34px; width:150px;  float: left;margin-left: 10px;">
  <option value="">请选择一个班级</option>
  <option value="010">计应1503</option>
  <option value="021">计应1504</option>
  <option value="0571">计应1501</option>
  <option value="0571">计应1502</option>
</select>  
       
     
<!-- 按钮代码 -->

<button class="layui-btn" style=" float:right ; margin-right: 10px; ">搜索</button>
    <!-- 表格代码 -->
    <div style="padding: 10px;clear: both;">
        <table class="layui-table"  >
  <colgroup>
    <col width="100">
    <col width="100">
    <col width="100">
    <col width="90">
    <col>
  </colgroup>
  <thead >
    <tr>

      <th style="text-align: center;">专业</th>
      <th style="text-align: center;">班级</th>
      <th style="text-align: center;">学号</th>
      <th style="text-align: center;">姓名</th>

      
    </tr> 
  </thead>
  <tbody>
    <tr>
    <td>网站开发</td>
      <td>计应1504</td>
      <td>2015002606</td>
      <td>武艳飞</td>
    </tr>
    <tr>
    <td>网站开发</td>
      <td>计应1504</td>
      <td>2015002606</td>
      <td>武艳飞</td>
    </tr>
     <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
    </tr>
    <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
        </tr>
    <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
      </tr>
    <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
    </tr>
    <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
      </tr>
    <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
    </tr>
    <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
    </tr>
    <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr    </tr>
    <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
      </tr>
    <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>


  </tbody>
</table>
<button class="layui-btn" style=" float:right ">提交</button>
 </div>       
</body>
<script src="../layui/layui.js" charset="utf-8"></script>
<script>
layui.use('element', function(){
  var element = layui.element(); //导航的hover效果、二级菜单等功能，需要依赖element模块
  
  //监听导航点击
  element.on('nav(demo)', function(elem){
    //console.log(elem)
    layer.msg(elem.text());
  });
});
</script>



</html>